<template>
  <base-breadcrumb :title="titleName">
    <searchData
      :search-data="searchArr"
      @search="search"
    />

    <a-card :bordered="false">
      <!-- <title-name title="分包商年度评级列表" /> -->
      <list-table
        ref="table"
        :scroll="{ x: 1500 }"
        row-key="id"
        :columns="columns"
        :request="loadData"
        :exportConfig="{ use: true, select: '分包商年度评级', all: '分包商年度评级' }"
        :exportConfigText="{ select: '导出选中', all: '导出全部' }"
        :statisticsConfig="{ use: true, statistics, temp }"
      >
        <span
          slot="serial"
          slot-scope="text, record, index"
        >{{ index + 1 }}</span>
        <span
          slot="status"
          slot-scope="text"
        >
          <a-badge
            :status="text | statusTypeFilter"
            :text="text | statusFilter"
          />
        </span>
        <span
          slot="description"
          slot-scope="text"
        >
          <ellipsis
            :length="8"
            tooltip
          >{{ text }}</ellipsis>
        </span>
        <span
          slot="actions"
          slot-scope="text, record"
        >
          <MoreButton>
            <span><a
                v-btnPermission="'pm_023_loo_01'"
                @click="handleDels(record)"
              >查看</a></span>
            <span
              v-if="record.statusCode != '2'"
              v-btnPermission="'pm_023_rat_02'"
            >
              <a-divider type="vertical" /><a @click="handleEdit(record)">评级</a>
            </span>
            <span
              v-if="record.statusCode == '3'"
              v-btnPermission="'pm_023_sub_02'"
            >
              <a-divider type="vertical" /><a @click="hanleApprove(record)">提交审核</a>
            </span>
            <span v-if="record.statusCode != '0'">
              <a-divider
                v-btnPermission="'pm_023_moi_03'"
                type="vertical"
              /><a
                v-btnPermission="'pm_023_moi_03'"
                @click="handleApproveDetail(record)"
              >审批信息</a>
            </span>
          </MoreButton>
        </span>
      </list-table>

      <ApprovalDetails
        :title="'审批详情'"
        :business-id="businessId"
        :visible="visibleApprove"
        @cancel="visibleApprove = false"
        @confirm="visibleApprove = false"
      />
    </a-card>
  </base-breadcrumb>
</template>

<script>
import moment from 'moment'
import { STable, Ellipsis } from '@/components'
import { getAnnualRatingList, getAnnualTotal, addGradingReview } from '@/api/subcontractors/annualRating'
import ApprovalDetails from '@/components/approvalDetails'
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import OrgTreeSelect from '@/components/OrgTreeSelect'
import ARow from 'ant-design-vue/es/grid/Row'

const columns = [
  {
    title: '序号',
    width: 65,
    scopedSlots: { customRender: 'serial' }
  },
  {
    title: '评级年份',
    width: 100,
    dataIndex: 'reviewYear'
  },
  {
    title: '分公司',
    width: 100,
    dataIndex: 'branch'
  },
  {
    title: '合格分包商总数',
    width: 140,
    dataIndex: 'qualifiedTotal'
  },
  {
    title: '分包商数(战略级)',
    width: 150,
    dataIndex: 'strategicLevel'
  },
  {
    title: '分包商数(一级)',
    width: 150,
    dataIndex: 'oneTotal'
  },
  {
    title: '分包商数(二级)',
    width: 150,
    dataIndex: 'twoTotal'
  },
  {
    title: '分包商数(三级)',
    width: 150,
    dataIndex: 'threeTotal'
  },
  {
    title: '本年评级状态',
    width: 120,
    dataIndex: 'statusName'
  },
  {
    title: '操作',
    dataIndex: 'actions',
    width: 150,
    scopedSlots: { customRender: 'actions' }
  }
]

export default {
  name: 'a' + Date.now(),
  components: {
    STable,
    Ellipsis,
    ApprovalDetails
  },
  data() {
    this.columns = columns
    return {
      titleName: '',
      searchArr: [
        // 搜索框
        {
          name: '所属单位',
          valueKey: 'searchQuery',
          type: OrgTreeSelect,
        },
        // {
        //   name: '分公司名称',
        //   valueKey: 'branchId',
        //   type: SelectSubCompany
        // },
        {
          name: '年份',
          value: 'years',
          type: 'select',
          data: []
        },
        {
          name: '本年评级状态',
          value: 'statusCode',
          type: 'select',
          data: [
            {
              value: '0',
              label: '待评级'
            },
            {
              value: '1',
              label: '已评级'
            }
          ]
        }
      ],
      statistics: {},
      temp: (s) => {
        return (
          <span style="margin-right: 12px">
            评级年份：<span className="totalNum">{this.totalDels.yearNum || 0} 个</span> | 待评级：<span className="totalNum">{this.totalDels.unratedNum || 0} 个</span> | 审核中：
            <span className="totalNum">{this.totalDels.reviewNum || 0} 个</span> | 审核不通过：<span className="totalNum">{this.totalDels.unreviewNum || 0} 个</span> | 已评级：
            <span className="totalNum">{this.totalDels.ratedNum || 0} 个</span>
          </span>
        )
      },

      // 高级搜索 展开/关闭
      advanced: false,
      // 查询参数
      queryParam: {},
      // 加载数据方法 必须为 Promise 对象
      loadData: (parameter) => {
        const requestParameters = Object.assign({}, parameter, this.queryParam)
        return getAnnualRatingList(requestParameters)
      },
      selectedRowKeys: [],
      selectedRows: [],
      totalDels: {},

      businessId: '',
      visibleApprove: false
    }
  },

  created() {
    this.getAnnualTotal()
    this.getToYear()
  },
  computed: {
    // rowSelection() {
    //   return {
    //     selectedRowKeys: this.selectedRowKeys,
    //     selectedRows: this.selectedRows,   // 当前行所有数据
    //     onChange: this.onSelectChange
    //   }
    // }
  },
  methods: {
    // 提交审核
    hanleApprove(val) {
      // 提交审批
      let that = this
      that.$confirm({
        title: '是否确定提交审批?',
        content: '',
        onOk() {
          return new Promise((resolve, reject) => {
            let data = { id: val.id }
            addGradingReview(data)
              .then((res) => {
                if (res.data.code == 200 || res.code == 200) {
                  that.$message.success('提交审批成功！')
                  that.$refs.table.refresh(true)
                } else {
                  that.$message.error('审批失败！')
                }
              })
              .catch((e) => {
                that.$message.error(e)
              })
              .finally(() => {
                resolve()
              })
          })
        },
        onCancel() {}
      })
    },
    // 获取2015年到当前年份
    getToYear() {
      var myDate = new Date()
      var thisYear = myDate.getFullYear() // 获取当年年份
      var Section = thisYear - 2015 // 声明一个变量 获得当前年份至想获取年份差 eg.2008
      var arrYear = [] // 声明一个空数组 把遍历出的年份添加到数组里
      for (var i = 0; i <= Section; i++) {
        arrYear.push(thisYear--)
      }
      let arryears = []
      for (let item in arrYear) {
        arryears.push({ value: arrYear[item], label: arrYear[item] + '年' })
      }
      this.searchArr[1].data = arryears
    },
    handleApproveDetail(record) {
      this.visibleApprove = true
      this.businessId = record.id
    },
    search(val) {
      this.queryParam = val
      this.$refs.table.refresh(true)
      this.getAnnualTotal()
    },

    getAnnualTotal() {
      getAnnualTotal(this.queryParam).then((res) => {
        this.totalDels = res.data
      })
    },

    handleDels(val) {
      // 查看年度评级想详情
      this.$router.push({ path: '/annual-grading/list', query: { id: val.id, type: 'view' } })
    },

    handleEdit(val) {
      this.$router.push({ path: '/annual-grading/list', query: { id: val.id } })
    },
    onSelectChange(selectedRowKeys, selectedRows) {
      this.selectedRowKeys = selectedRowKeys
      this.selectedRows = selectedRows
    },
    toggleAdvanced() {
      this.advanced = !this.advanced
    },
    resetSearchForm() {
      this.queryParam = {
        date: moment(new Date())
      }
    }
  }
}
</script>


